import React, { Component } from 'react'
import {CounterConsumer} from '../CounterStore'

export default class CountBtn extends Component {
    render() {
        return (
            // 获取元素中间传递的值（例如+和-的符合）
            // <button>{this.props.children}</button>
            <CounterConsumer>
                {
                    ({incrementfn, decrementfn}) => { //(ctx) 可以直接把请求对象全部参数，通过log看和调式，正常用就解构需要的
                        // 通过组件的属性值判断按钮的类型，进行函数选择赋值调用
                        const handler = this.props.type === 'increment' ? incrementfn:decrementfn
                        return <button onClick={handler}>{this.props.children}</button>
                    }
                }
            </CounterConsumer>
        )
    }
}